Fixing box with corner radius doesn't have shadow#15614
Open
protikbiswas100 wants to merge 5 commits into0.82-stablefrom
Open
Fixing box with corner radius doesn't have shadow#15614protikbiswas100 wants to merge 5 commits into0.82-stablefrom
protikbiswas100 wants to merge 5 commits into0.82-stablefrom
Conversation
vineethkuttan
approved these changes
Feb 3, 2026
| if ( | ||
| component === 'Flyout' || | ||
| component === 'XAML' || | ||
| component === 'Xaml WinUI3 (Experimental, for Fabric)' || |
Contributor
There was a problem hiding this comment.
Why this change added?
Contributor
Author
There was a problem hiding this comment.
The visitAllPages.test.ts E2E test iterates through all component examples in RNTester and visits each page. Some components are skipped because they have known issues with E2E automation (Flyout, XAML, SwipeableCard).
Please see the pipeline error in 0.82 I was getting without this change https://dev.azure.com/ms/react-native-windows/_build/results?buildId=628033&view=logs&s=843cf892-394e-5a95-58a2-f157705529be&j=91433fce-a6a7-5848-fbf7-7248349c63dd
acoates-ms
requested changes
Feb 3, 2026
| Visual()); | ||
| if (innerVisual) { | ||
| // Create a VisualSurface that captures the visual (with its clip applied) | ||
| auto visualSurface = msCompositor.CreateVisualSurface(); |
Contributor
There was a problem hiding this comment.
Are we doing this even for views that do not have a shadow? Looks expensive.
microsoft-github-policy-service
bot
added
the
Needs: Author Feedback
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
The
boxShadowstyle property does not render whenborderRadiusis also set on a View. Only one attribute works at a time - the shadow is ignored if both are presentType of Change
Why
In composition, when a geometric clip is applied to a visual for
borderRadius, the clip affects both the visual content AND itsDropShadowSince shadows extend outside the visual bounds, the shadow gets clipped and becomes invisible.What
CompositionSwitcher.idl: Added Mask() and SourcePolicy() methods to IDropShadow interface
CompositionContextHelper.cpp: Implemented Mask() and SourcePolicy() in CompDropShadow, added CompositionDropShadowSourcePolicy type mappings
CompositionViewComponentView.cpp: Updated applyShadowProps() to conditionally use the mask approach when borderRadius is present
Screenshots
Before
After
Testing
If you added tests that prove your changes are effective or that your feature works, add a few sentences here detailing the added test scenarios.
Changelog
Should this change be included in the release notes: yes
Fixed issue where box with corner radius doesn't have shadow
Microsoft Reviewers: Open in CodeFlow
Microsoft Reviewers: Open in CodeFlow
Microsoft Reviewers: Open in CodeFlow